<template>
	<view>
		<uv-form labelPosition="left" labelWidth="120" :model="formData" :rules="rules" ref="form">
			<view class="bg-white padding-lr margin-bottom">
				<uv-form-item :label="formData.homeworkType == 1?'药物图拍摄(最多3张)':'货物图拍摄(最多3张)'" labelWidth="160" prop="drugImage" labelPosition="top">
					<view class="margin-tb-sm">
						<ImageUpload v-model="formData.drugImage" />
					</view>
				</uv-form-item>
				<uv-form-item :label="formData.homeworkType == 1?'开药图拍摄(最多3张)':'开吊图拍摄(最多3张)'" labelWidth="160" prop="prescribeImage" labelPosition="top">
					<view class="margin-tb-sm">
						<ImageUpload v-model="formData.prescribeImage" />
					</view>
				</uv-form-item>
				<uv-form-item label="作业图拍摄(最多3张)" labelWidth="160" prop="homeworkImage" labelPosition="top">
					<view class="margin-tb-sm">
						<ImageUpload v-model="formData.homeworkImage" />
					</view>
				</uv-form-item>
				<uv-form-item label="收队图拍摄(最多3张)" labelWidth="160" prop="endImage" labelPosition="top">
					<view class="margin-tb-sm">
						<ImageUpload v-model="formData.endImage" />
					</view>
				</uv-form-item>
				<uv-form-item label="作业轨迹图拍摄(最多3张)" labelWidth="200" prop="trajectoryImage" labelPosition="top">
					<view class="margin-tb-sm">
						<ImageUpload v-model="formData.trajectoryImage" />
					</view>
				</uv-form-item>
			</view>
			<!-- <uv-gap height="10" bgColor="#f1f1f1"></uv-gap> -->
			<view class="bg-white padding-lr">
				<uv-form-item :label="formData.homeworkType == 2 ? '实际重量': '实际面积'" prop="actualArea" borderBottom>
					<uv-input v-model="formData.actualArea" border="none" placeholder="请如实填写" @input="onInputChange">
						<template v-slot:suffix>
							<text v-if="formData.homeworkType == 2">吨</text>
							<text v-else>亩</text>
						</template>
					</uv-input>
				</uv-form-item>
				<uv-form-item v-if="formData.orderType == 1 && formData.homeworkType==1" label="推荐亩用量"
					prop="cropAcreUsage" borderBottom>
					<uv-input type="digit" v-model="formData.cropAcreUsage" border="none" @input="onInputChange1">
					</uv-input>
					<template v-slot:right>
						<text>L</text>
					</template>
				</uv-form-item>
				<uv-form-item v-if="formData.orderType==1" prop="actualMoney" borderBottom>
					<template v-slot:default>
						<view class="flex align-center">
							<view class="flex align-center" style="width: 120px;" @click="showModal">
								<text style="font-size: 15px;">实际金额</text>
								<uv-icon name="question-circle-fill" color="#006BFE" size="20"></uv-icon>
							</view>
							<uv-input :readonly="true" v-model="formData.actualMoney" border="none" placeholder="请填写实际金额">
								<template slot='suffix'>
									<view class="flex align-center">
										<text>元</text>
										<!-- <uv-icon name="question-circle-fill" color="#006BFE" size="20"></uv-icon> -->
									</view>
								</template>
							</uv-input>
						</view>
					</template>
					
				</uv-form-item>
				<uv-form-item label="备注" prop="actualRemarks" borderBottom>
					<uv-textarea :maxlength="-1" autoHeight v-model="formData.actualRemarks" border="none"
						placeholder="请填写备注">
					</uv-textarea>
				</uv-form-item>
			</view>
		</uv-form>

		<PriceDetailModal ref="priceDetailModal" />

		<view style="height: 100px;"></view>

		<view class="foot-box">
			<button class="cu-btn bg-save flex-sub margin-right" @click="handleSave">进度保存</button>
			<button class="cu-btn bg-main flex-sub" @click="submit(5)">完工汇报</button>
		</view>
	</view>
</template>
<script>
	import ImageUpload from '@/components/imageUpload/index.vue'
	import PriceDetailModal from "@/components/priceDetailModal/index"
	import {
		selectDictLabel
	} from '@/utils/huida.js'
	export default {
		components: {
			ImageUpload,
			PriceDetailModal
		},
		data() {
			return {
				formData: {
					drugImage: '',
					prescribeImage: '',
					homeworkImage: '',
					endImage: '',
					trajectoryImage: '',
					cropType: '',
					actualArea: '',
					cropAcreUsage: '',
					actualMoney: '',
					actualRemarks: '',
					homeworkType: '',
					homeworkTypeName: '',
					orderType: '',
				},
				rules: {
					'actualArea': {
						type: 'string',
						required: true,
						message: '请如实填写',
						trigger: ['blur', 'change']
					},
					'cropAcreUsage': {
						type: 'string',
						required: true,
						message: '请填写实际亩用量',
						trigger: ['blur', 'change']
					},
					drugImage: {
						type: 'string',
						required: true,
						message: '请上传照片',
						trigger: ['blur', 'change']
					},
					prescribeImage: {
						type: 'string',
						required: true,
						message: '请上传照片',
						trigger: ['blur', 'change']
					},
					homeworkImage: {
						type: 'string',
						required: true,
						message: '请上传照片',
						trigger: ['blur', 'change']
					},
					endImage: {
						type: 'string',
						required: true,
						message: '请上传照片',
						trigger: ['blur', 'change']
					},
					trajectoryImage: {
						type: 'string',
						required: true,
						message: '请上传照片',
						trigger: ['blur', 'change']
					},
				},
				id: '',
				orderLogId: '',
				actionsHw: []
			}
		},
		onLoad(data) {
			this.id = data.id
			this.orderLogId = data.orderLogId
			uni.$uv.http.get('/system/dict/data/type/homework_type').then(res => {
				this.actionsHw = res.data.map(item => ({
					name: item.dictLabel,
					label: item.dictLabel,
					value: item.dictValue
				}))
			})
			this.fetchDetail()
		},
		methods: {
			fetchDetail() {
				this.$http.get('/cadre/assignOrder/getDatail', {
					params: {
						id: this.id,
						...(this.$hd.position || {}),
					}
				}).then(res => {
					// this.orderData = res.data
					// res.data.homeworkTypeName = selectDictLabel(this.actionsHw, res.data.homeworkType)
					this.formData.orderType = res.data.orderType
					this.formData.cropType = res.data.cropType
					this.formData.cropAcreUsage = res.data.cropAcreUsage
					this.formData.actualArea = res.data.actualArea ? res.data.actualArea : res.data.area
					this.formData.actualMoney = res.data.actualMoney ? res.data.actualMoney : res.data.money
					this.formData.actualRemarks = res.data.actualRemarks
					this.formData.homeworkType = res.data.homeworkType
					this.formData.homeworkTypeName = res.data.homeworkTypeName
					if (res.data.drugImage) {
						this.formData.drugImage = res.data.drugImage
					}
					if (res.data.prescribeImage) {
						this.formData.prescribeImage = res.data.prescribeImage
					}
					if (res.data.homeworkImage) {
						this.formData.homeworkImage = res.data.homeworkImage
					}
					if (res.data.endImage) {
						this.formData.endImage = res.data.endImage
					}
					if (res.data.trajectoryImage) {
						this.formData.trajectoryImage = res.data.trajectoryImage
					}
				})
			},
			// 保存
			handleSave() {
				uni.showLoading()
				this.$http.post('/cadre/assignOrder/allocation', {
					id: this.id,
					orderLogId: this.orderLogId,
					status: 4,
					...this.formData
				}).then(res => {
					uni.hideLoading()
					if (res.code == 200) {
						uni.showToast({
							title: '操作成功',
							duration: 2000
						})
						// 订阅
						// this.subscribeMsg()
						// uni.navigateBack()
					} else {
						uni.showToast({
							icon: 'error',
							title: res.msg
						})
					}
				})
			},
			// 提交
			submit(flag) {
				// 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
				this.$refs.form.validate().then(val => {
					uni.showLoading()
					this.$http.post('/cadre/assignOrder/allocation', {
						id: this.id,
						orderLogId: this.orderLogId,
						status: flag,
						...this.formData
					}).then(res => {
						uni.hideLoading()
						if (res.code == 200) {
							uni.showToast({
								title: '操作成功',
								duration: 2000
							})
							if(this.formData.orderType == 0) {
								uni.navigateBack()
								return
							}
							// 订阅
							this.subscribeMsg()
							// uni.navigateBack()
						} else {
							uni.showToast({
								icon: 'error',
								title: res.msg
							})
						}
					})
				}).catch(errors => {
					uni.showToast({
						icon: 'error',
						title: '请检查信息项'
					})
				})
			},
			// 重置
			reset() {
				this.$refs.form.resetFields();
				this.$refs.form.clearValidate();
			},
			onInputChange() {
				this.fetchMoney()
			},
			onInputChange1(e) {
				if (!this.formData.actualArea || !e) return
				this.fetchMoney(e)
			},
			// 获取金额
			fetchMoney(v) {
				if (!this.formData.actualArea || this.formData.orderType == 0) return
				const fn = () => {
					this.$http.get('/cadre/highSeasOrder/sumAmount', {
					params: {
						orderType: this.formData.orderType,
						cropType: this.formData.cropType,
						area: this.formData.actualArea,
						homeworkType: this.formData.homeworkType,
						cropAcreUsage: v
					}
				}).then(res => {
					// this.formData.actualMoney = res.data.estimatedAmount
					if (this.formData.homeworkType == 2) {
						this.formData.actualMoney = res.data.estimatedAmount
					} else {
						this.formData.totalAmount = res.data.totalAmount || 0
						this.formData.price = res.data.price || 0
						this.formData.startingPrice = res.data.startingPrice || 0
						this.formData.acreUsage = res.data.acreUsage || 0
						this.formData.cropAcreUsage = res.data.acreUsage || 0
						this.formData.discountAmount = res.data.discountAmount || 0
						if (res.data.estimatedAmount * 1 < res.data.startingPrice * 1) {
							this.formData.actualMoney = res.data.startingPrice
						} else {
							this.formData.actualMoney = res.data.estimatedAmount
						}
						// this.formData.money = res.data.estimatedAmount - this.formData.discountAmount
					}
				})
				}
				
				uni.$uv.debounce(fn, 500)
			},
			// 订阅消息
			// wx.requestSubscribeMessage
			subscribeMsg() {
				const that = this
				uni.showModal({
					title: '订阅提示',
					content: '请您订阅消息推送提醒，以便后续转账能够及时通知您！',
					success: function(res) {
						if (res.confirm) {
							that.$http.get('/system/config/list?configKey=settlement_notice_template_id').then(res => {
								if(res.code == 200 && res.rows.length > 0) {
									let temId = res.rows[0].configValue
									wx.requestSubscribeMessage({
										tmplIds: [temId],
										success(suc) {
											uni.showToast({
												icon: 'success',
												title: '订阅成功'
											})
										},
										fail(e) {
											console.log('fail', e)
										},
										complete(e) {
											console.log('complete', e)
											uni.navigateBack()
										}
									})
								}
							})
							
						}
					},
				})
			},
			showModal() {
				if (!this.formData.actualArea) return uni.showToast({
					title: this.formData.homeworkType==1?'请输入实际作业面积':'请输入实际货物重量',
					icon: 'none'
				})
				if (this.formData.homeworkType==1 && !this.formData.cropAcreUsage) return uni.showToast({
					title: '请输入实际亩用量',
					icon: 'none'
				})
				this.$refs.priceDetailModal.show({
					cropType: this.formData.cropType,
					area: this.formData.actualArea,
					cropAcreUsage: this.formData.cropAcreUsage,
					homeworkType: this.formData.homeworkType,
					homeworkTypeName: selectDictLabel(this.actionsHw, this.formData.homeworkType) //this.formData.homeworkTypeName
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.foot-box {
		position: fixed;
		bottom: 0%;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx;
		background-color: #fff;
		z-index: 99;
	}

	.bg-save {
		color: #006BFE;
		background-color: #E9ECFF;
	}
</style>